import React from "react";
import { Modal, Form, Input, Button, Select } from "antd";

const { Option } = Select;

const AddOrEditModal = ({
  title,
  visible,
  setVisible,
  onSubmit,
  form,
  value
}) => {
  const handleOk = () => {
    form.validateFields((err, values) => {
      if (err) return;
      form.resetFields();
      onSubmit({
        ...values,
        id: value?.id
      });
    });
  };
  return (
    <Modal
      destroyOnClose
      title={title}
      visible={visible}
      onOk={handleOk}
      onCancel={() => setVisible(false)}
      okText="确定"
      cancelText="取消"
    >
      <Form>
        <Form.Item
          label="部门名称"
          rules={[{ required: true, message: "Please input your username!" }]}
        >
          {form.getFieldDecorator("name", {
            rules: [{ required: true, message: "请输入部门名称" }],
            initialValue: value?.name
          })(<Input allowClear />)}
        </Form.Item>
        <Form.Item label="部门级别" rules={[{ required: true }]}>
          {form.getFieldDecorator("departmentLevel", {
            rules: [{ required: true, message: "请输入部门级别" }],
            initialValue: value?.departmentLevel
          })(
            <Select>
              <Option value="MASTER">总部</Option>
              <Option value="BRANCH">分部门</Option>
            </Select>
          )}
        </Form.Item>
      </Form>
    </Modal>
  );
};

export default Form.create()(AddOrEditModal);
